<template>
  <view class="search-city-result">
    <uni-list>
      <uni-list-item 
        clickable
        v-for="(cityItem, index) in list"
        :key="index"
        :ellipsis="1"
        @click="handleClick(cityItem)">
        <template v-slot:header>
					<basic-highlight class="header-text" :content="cityItem.name" :keys="keywords" color="#FF873D"/>
        </template>
      </uni-list-item>
    </uni-list>
    <!-- 安全区 -->
    <basic-safe-area />
  </view>
</template>

<script>
import sdk from "sdk"
export default {
  props: ['list', 'keywords'],

  methods: {
    handleClick(item) {
      // 选中参数传回上一页
      sdk.selectCity({
        regionId: String(item.regionId),
        name: item.name,
        country: 0
      })

      sdk.navigateBack()
    }
  }
}
</script>

<style lang="less">
.search-city-result {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 2;

  background: #ffffff;
}
/* #ifdef H5 */
/deep/ .uni-list-item__container {
  line-height: 54rpx;
}
/* #endif */
</style>
